<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>明德后台管理系统</title>
    <link rel="stylesheet" href="/static/layui-v2.6.8/layui/css/layui.css">
    <style>
        /* #upload {
        width: 100px;
        line-height: 40px;
        border-radius: 8px;
        outline: 0;
        border: 0;
        background-color: rgb(69, 146, 123);
        color: #fff;
        font-size: 20px;
        cursor: pointer;
    } */
    </style>
</head>

<body>
    <div class="layui-layout layui-layout-admin">
        <!-- 引入公共页面 -->
        {{include "./common/header.html" }}
        <!-- 引入公共页面 -->
        {{include "./common/side-menu.html" }}


        <div class="layui-body">
            <!-- 内容主体区域 -->
            <div style="padding: 15px;">
                <span class="layui-breadcrumb" lay-separator=">">
                    <a href="/">首页</a>
                    <a href="/addCate">分类添加</a>
                    <a href="/edit-Cate">分类编辑</a>
                </span>

                <form style="padding: 15px;" class="layui-form" id="theform">
                    <div class="layui-form-item">
                        <label class="layui-form-label">分类名称： </label>
                        <div class="layui-input-inline">
                            <input type="text" class="layui-input" name="cate_name" autocomplete="off">
                        </div>
                    </div>



                    <div class="layui-form-item ">
                        <label class="layui-form-label "> 显示首页: </label>
                        <div class="layui-input-block">

                            <input type="radio" name="is_show" value='1' title="显示" checked="checked">
                            <input type="radio" name="is_show" value='0' title="不显示">
                        </div>
                    </div>



                    <div class="layui-form-item">
                        <div class="layui-input-block">
                            <!-- <button class="layui-btn layui-btn-normal">添加</button> -->
                            <input type="button" id="add" class="layui-btn layui-btn-normal" value=添加>
                        </div>
                    </div>
            </div>
            <div id="div1">
                
            </div>
            </form>
        </div>
    </div>

    <!-- 引入公共页面 -->
    {{include "./common/footer.html" }}

    </div>
    <script src="/static/js/jquery.js"></script>
    <script src="/static/layui-v2.6.8/layui/layui.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/wangeditor@latest/dist/wangEditor.min.js"></script>
    <script>
        //JS 
        layui.use(['element', 'layer', 'util'], function () {
            var element = layui.element
                , layer = layui.layer
                , util = layui.util
                , $ = layui.$;

            //头部事件
            util.event('lay-header-event', {
                //左侧菜单事件
                menuLeft: function (othis) {
                    layer.msg('展开左侧菜单的操作111', { icon: 0 });
                }
                , menuRight: function () {
                    layer.open({
                        type: 1
                        , content: '<div style="padding: 15px;">处理右侧面板的操作234</div>'
                        , area: ['260px', '100%']
                        , offset: 'rt' //右上角
                        , anim: 5
                        , shadeClose: true
                    });
                }
            });

        });
        // 上传文件

        //添加分类
        $("#add").click(function () {
            //$ajax + formData
            $.ajax({
                type: "post",
                url: "/ajaxAddCate",
                data: new FormData($("#theform")[0]),
                processData: false,
                contentType: false,
            }).then(({ code, message }) => {
                layer.msg(message)
                if (code === 20000) {
                    location.href = "/catelist"
                }
            })
        })
        //富文本编辑器
        const txt = window.wangEditor
        const editor = new txt('#div1')
        
        // 或者 const editor = new E( document.getElementById('div1') )
        editor.create()
    </script>
</body>

</html>